<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:p="http://primefaces.org/ui"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">

<h:head>
<title>Cadastro de Usuario</title>
</h:head>

<h:body>

	<p:accordionPanel id="accordion" activeIndex="null">
		<p:tab title="Cadastro de Usuarios">
		
			<p:panel header="Cadastro">
				<h:form id="form1" enctype="multipart/form-data">
					<h:panelGrid columns="2">
						<p:outputLabel value="Nome"/>
						<p:inputText value="#{mb.usuario.login}" 
						required="true" requiredMessage="digite o nome" placeholder="digite o nome"/>
						
						
						<p:outputLabel value="Senha"/>
						<p:password  match="pw2" id="senha" required="true" requiredMessage="digite a senha" placeholder="digite a senha"/>
						
						<p:outputLabel value="ConfirmeSenha"/>
						<p:password   id="pw2" required="true" requiredMessage="digite a senha" placeholder="Confirme a senha"
						feedback="true" promptLabel="fraco bom otimo" weakLabel="fraco"
                           goodLabel="bom" strongLabel="otimo" value="#{mb.usuario.senha}"/>
						
						
						<p:outputLabel value="Imagem"/>
						<p:fileUpload mode="simple" value="#{mb.arquivo}"/>
						
						<p:outputLabel value="Data Nasc.:"/>
						<p:calendar value="#{mb.usuario.nascimento}" required="true" requiredMessage="digite a data de nascimento"
						placeholder="digite a data nascimento" />
						
						<p:outputLabel value="Celular.:"/>
						<p:inputMask value="#{mb.usuario.celular}" required="true" requiredMessage="digite o nº do celular"
						placeholder="digite o nº do celular" mask="(99) 9999-9999"/>
						
						
					</h:panelGrid>
					
					<p:commandButton icon="ui-icon-disk" action="#{mb.cadastrar}" 
					    ajax="false" update=":form1"/>
				
				<p:message for="form1"/>
				<p:growl/>
				</h:form>		
				
			</p:panel>
		
		</p:tab>
	
	
		<p:tab title="Lista de Usuarios">
		
		  <h:form id="form2">
		  	
		  	<p:dataGrid value="#{mb.listaUsuario}" var="linha" paginator="true" columns="2">
		  		
		  		<p:panelGrid columns="2">
		  			
		  			<h:panelGroup>
		  				
		  				<p:commandLink onclick="janela.show()" update=":form3">
		  					<p:graphicImage value="/images/#{linha.imagem}" title="#{linha.login}" 
		  					  width="100px" />
		  				    <f:setPropertyActionListener target="#{mb.usuario}" value="#{linha}"/>
		  				</p:commandLink>
		  			
		  			</h:panelGroup>
		  			
		  		</p:panelGrid>
		  	           <p:commandButton   action="#{mb.excluir}" 
			         ajax="false" update=":form2" onclick="if (!confirm('Deseja realmente excluir o usuario #{linha.login}?')) return false;"
			         icon="ui-icon-trash">
			          <f:setPropertyActionListener target="#{mb.usuario}"
                                                        value="#{linha}" />
			         
			         </p:commandButton>
			         <p:selectBooleanButton id="value1" value="#{mb.usuario.ativo}" onLabel="Ativo" offLabel="Inativo" style="width:70px" />
		  	</p:dataGrid>
		         
		       
		  </h:form>
		
			
		</p:tab>
	
	</p:accordionPanel>
	
	
	<p:dialog widgetVar="janela" modal="true" height="400" closable="true">
		<h:form id="form3">
			
			<p:panelGrid columns="2">
			<f:facet name="header">
				<p:graphicImage value="/images/#{mb.usuario.imagem}" width="150px"/>
			</f:facet>
		
					<p:outputLabel value="Nome"/>
					<p:outputLabel value="#{mb.usuario.login}"/>
					
					<p:outputLabel value="Nascimento"/>
					<p:outputLabel value="#{mb.usuario.nascimento}"/>
					
					<p:outputLabel value="Celular"/>
					<p:outputLabel value="#{mb.usuario.celular}" />
							
					
			</p:panelGrid>
		
		</h:form>
	
	</p:dialog>



</h:body>



</html>